<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width,initial-scale=1.0">
	<title>测试</title>
	<style>
		* {
			margin: 0;padding: 0;
		}
		/* .container {
			width: 100%;
			display: flex;
			height: 50px;
		}
		.column {
			flex: 1;
		}
		.container .column:first-child {
			background-color: #000;
			min-width: 400px; 
			flex: 0;
		} */
		div{ border:1px solid black;
				width:200px;
				height:100px;
			}

div+span {
   background-color:black;
   color:white;
   width:40px;
   height:40px; 
  margin:auto;
} 
	</style>
</head>
<body>
	JS基础
	<div>1</div>
	<div>2</div>
	<div>3</div>
	<div>4</div>
	<div id="app"></div>
	<h2>div中的span样式演示</h2>

<div  >

<span >
  div中span样式测试
</span>
   

</div>

<span >
 span相邻兄弟选择器 测试
</span>
	<script type="text/javascript">
		window.onload = () => {
// 			function sum(a){
// 				debugger
//     let temp = function(b){
//         return sum(a+b)
//     }
//     // temp.toString这里写成temp.valueOf也可以
//     temp.toString = function(){
//         return a
//     }
//     return temp
// }
function sum(a){
	console.log(a)
    return function(b){
		return sum(a+b)
    }
	return a
}

let ans = sum(1)(2)(3)(1)
console.log(ans)
    //   if ([...arguments][1] == undefined) {
    //     let befor = [...arguments][0];
    //     return function suum(afte) {
    //       let sum2 = befor + afte;
    //       console.log(`outPut${sum2}`);
    //     }
    //   } else {
    //     let sum1 = x + y;
    //     console.log(`outPut${sum1}`);
    //   }
    // }
 
			// 浏览器机制中触发事件的三个阶段
			// 1捕获
			// 2处理
			// 3冒泡
			// addEventListener的第三个参数的作用----阻止冒泡

			// 了解JS的作用域么，函数作用域是在什么时候形成的
			// 页面加载；
			// 创建window全局对象，并生成全局作用域；
			// 然后生成执行上下文，预解析变量(变量提升)，生成全局变量对象；
			// 然后逐行解析，执行流依次执行每行/块代码；
			// 直至运行到fn3()；
			// 执行流将fn3压入环境栈中；
			// 创建fn3的执行环境，创建定义域和定义域链，根据执行上文创建变量对象；
			// 在创建变量对象的过程中沿定义域链逐级线上搜索变量，并将结果存在函数变量对象中，其中第一活动对象为arguments；

			// Set、Map、WeakSet 和 WeakMap 的区别
			// var arr = [1,2,3,2,4,1];
			// var a = [...new Set([1,2,3,2,4,1])] //Set去重,{1,2,3,4}，成员唯一。add(),delete(),has()
			// var b =  new WeakSet(arr)//成员唯一元素只能是对象， 对象也是弱引用 ,垃圾回收，无法遍历， 没有size， 也没有clear。add(),delete(),has()
			// var arr1 = new Map([['a',2],['a',2],['a',3],['b',5]]);//对象去重后唯一，方法set('v',4564),get('a'),...arr1.entries()
			// 转换一个类数组对象--将伪数组转为真实数组的方法1[...divList]， 2Array.from(divList),Array.prototype.slice.call(divList)
			// var divList = document.getElementsByTagName('div');//只有数组对象，只有数组长度，但没有数组的方法
			// divList.map((v)=>{console.log(v)}) 报错，因为没有方法
			// var arr = [...divList]
			// var arr1 = Array.from(divList)
			// var arr2 = Array.prototype.slice.call(divList)

			// JS的基础数据类型
			// Number、String、Boolean、Null、undefined、object、symbol、bigInt（谷歌67版本中还出现了一种 bigInt
		}
	</script>
</body>

</html>